<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <!--引入vue.min.js-->
    <script src="vue.min.js"></script>
</head>
<body>
    <!--定义表示范围 id可以随意指定-->
    <div id="app">
        <!--指令 V- 单向绑定指令v-bind:-->
        <p v-bind:title="message" v-bind:name="ddd">编写排序类Sort</p>
        title是html自带的一个属性,vue使用脚本进行渲染达到效果
        v-bind可以单向绑定很多属性值,几乎是所有属性
        <!--单向绑定指令v-bind:可以简写成:-->
        <p :title="message" :name="ddd">编写排序类Sort</p>
    </div>
</body>
<script>
    //##创建 vue实例
    new Vue({
        el:'#app',//##绑定标识范围
        data:{//##定义变量,并进行初始化
            message:'·待排序的元素需要实现ava的Comparable接口，该接口有compareTo()方法，可以用它来判断两个元素的大小关系。·使用辅助函数less()和swap()来进行比较和交换的操作，使得代码的可读性和可移植性更好。·排序算法的成本模型是比较和交换的次数。',
            ddd:'username'
        }
    })
</script>
</html>